<template>
  <div>
    <h3>child组件</h3>
    <ul>
      <li v-for="item in users" :key="item.id">{{ item.name }}</li>
    </ul>
  </div>
</template>

<script>
import { ref } from 'vue'
import { get } from '../utils/request'

export default {
  // 默认setup是不能使用async/await
  // 如果你要用到async，则此组件在被调用时，一定要包裹在Suspense组件内
  // 顶层await
  async setup() {
    const users = ref([])
    // get('/api/users').then((ret) => {
    //   users.value = ret.data
    // })
    let ret = await get('/api/users')
    users.value = ret.data

    return {
      users
    }
  }
}
</script>

<style lang="scss" scoped></style>
